<template>
  <!-- 图档批量操作复用组件 -->
  <div>
    <BasicModal
      v-bind="$attrs"
      title="选中数据"
      @register="register"
      @cancel="handleCancel"
      :destroyOnClose="true"
      :minHeight="450"
      :width="800"
      :showOkBtn="false"
    >
      <template #insertFooter>
        <a-button color="error">{{ t('common.batchPublish') }}</a-button>
        <a-button color="success">{{ t('common.batchCheckIn') }}</a-button>
        <a-button color="warning">{{ t('common.batchCheckOut') }}</a-button>
      </template>
      <BasicTable @register="registerTable">
        <!-- 创建时间 -->
        <template #creattime="{ text: creattime }">
          <span>
            {{ proxy.$filters.filterTime(creattime) }}
          </span>
        </template>
        <!-- 文档状态 -->
        <template #state="{ text: state }">
          <span>
            <Tag :color="state === '8' ? 'green' : state === '1' ? 'red' : 'blue'">
              {{ proxy.$filters.filterDocumentStatus(state) }}
            </Tag>
          </span>
        </template>
        <!-- 是否为关联文件 -->
        <template #isshortcut="{ text: isshortcut }">
          <span>
            <Tag :color="isshortcut === '1' ? 'green' : isshortcut === '0' ? 'red' : 'blue'">
              {{ proxy.$filters.filterIsRelated(isshortcut) }}
            </Tag>
          </span>
        </template>
        <!-- 是否所属零件 -->
        <template #isPartAttachment="{ text: isPartAttachment }">
          <span>
            {{ isPartAttachment === '1' ? t('common.yes') : t('common.no') }}
          </span>
        </template>
        <!-- 零件信息 -->
        <template #partInfo="{ text: partInfo }">
          <span>
            <Tooltip :title="partInfoTitle(partInfo)">
              {{
                partInfo != null
                  ? `零件代号：${partInfo.partThitObjectId}-零件名称：${
                      partInfo.partName
                    }-零件类型：${partInfo.partType}-零件状态：${proxy.$filters.filterPartStatus(
                      partInfo.partStatus,
                    )}-零件版本：${partInfo.partVersion}`
                  : '无'
              }}
            </Tooltip>
          </span>
        </template>
      </BasicTable>
    </BasicModal>
  </div>
</template>

<script lang="ts" setup>
  import { getCurrentInstance } from 'vue';
  import { Tag, Tooltip } from 'ant-design-vue';
  import { BasicModal, useModalInner } from '/@/components/Modal';
  import { BasicTable, useTable } from '/@/components/Table';
  import { getDocumentColumns } from '/@/views/demo/documentManager/tableData';
  import { useI18n } from '/@/hooks/web/useI18n';

  const { t } = useI18n();
  const { proxy }: any = getCurrentInstance();
  // 计算零件信息
  const partInfoTitle = (partInfo) => {
    if (!partInfo) {
      return '暂无零件信息';
    }
    const { partThitObjectId, partName, partType, partStatus, partVersion } = partInfo;
    // 假设你在全局过滤器里定义了 filterDocumentStatus
    const filterState = proxy.$filters.filterPartStatus(partStatus);
    // 多行显示，每行一个字段
    return [
      `零件代号：${partThitObjectId}`,
      `零件名称：${partName}`,
      `零件类型：${partType}`,
      `零件状态：${filterState}`,
      `零件版本：${partVersion}`,
    ].join('\n');
  };

  const handleCancel = () => {
    closeModal();
  };
  // 初始化弹窗
  const [register, { setModalProps, closeModal }] = useModalInner((data) => {
    setModalProps({ confirmLoading: false });
    setTableData(data.dataSource);
    console.log(data);
  });

  // 表格初始化
  const [registerTable, { setTableData }] = useTable({
    columns: getDocumentColumns(),
    bordered: true,
    useSearchForm: false,
    showIndexColumn: false,
    showTableSetting: true, // 显示表格设置工具
    tableSetting: { fullScreen: true }, // 表格设置工具配置
    pagination: false,
    canResize: false,
    striped: false,
    scroll: { y: 400 },
  });
</script>
